﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Special.aspx.cs" Inherits="BookStore.Special" MasterPageFile="~/Home.Master" Title="Stationery" %>
<asp:Content ID="content" runat="server" ContentPlaceHolderID="cphhome">
<div class="breadcrumb">
        <a href="Default.aspx">Home</a>
      </div>
        <div class="product-filter">
        <div class="sort"><b>Sort By:</b>
      <select onchange="location = this.value;">
                        <option value="#" selected="selected">Default</option>
                                
                      </select>
    </div>
    <div class="limit"><b>Show:</b>
      <select onchange="location = this.value;">
                        <option value="#">12</option>
                               
                      </select>
    </div>
  <div class="product-compare"><a href="#" id="compare-total"></a></div>
    <div class="display"><b>Display:</b> List  <a onclick="display('grid');">Grid</a></div>
  </div>

  <div class="product-list">
  <ul>
      <asp:Repeater ID="Repeater1" runat="server">
     
     <%-- <asp:ListView ID="ListView1" runat="server">--%>
      <ItemTemplate>
            <li class="first-in-line">
            
           <div class="image"><a href="#">
               <asp:LinkButton ID="lbnimg" runat="server" 
                            CommandArgument='<%# Eval("productId") %>' onclick="lbnimg_Click"> <asp:Image ID="Image1" runat="server" ImageUrl='<%# "/image/Catalog/"+Eval("images") %>' Width="126px" Height="188px" /> </asp:LinkButton></a></div>
           
            <div class="name">
           <a href='ProductDetail.ascx?catogoryID=<%#Eval("catogoryID") %>&productID=<%# Eval("productID") %>'></a>
          <asp:LinkButton ID="lnbname" runat="server"
                        CommandArgument='<%# Eval("productId") %>' Text='<%# Eval("productName") %>' 
                             onclick="lnbname_Click"></asp:LinkButton>
           </div>
      <div class="description">
	
          <asp:Label ID="Label1" runat="server" Text='<%# Eval("description") %>'></asp:Label></div>
            <div class="price">
        <span class="price-new"><asp:Label ID="Label3" runat="server" Text='<%# Eval("price", "{0:C}") %>'></asp:Label></span>
        <span class="price-old"></span> 
                        <span class="price-tax"></span>
              </div>
            <div class="rating">
            </div>
             <div class="cart" style=" text-align:center; ">
                        <asp:LinkButton ID="LinkButton1" runat="server" CssClass="button addToCart" 
                              ForeColor="White" Font-Size="12px" Height="22px" Width="100px"  
                              CommandArgument='<%# Eval("productId") %>' onclick="LinkButton1_Click">Add to cart</asp:LinkButton></a></div>
    </li>
      </ItemTemplate>
       </asp:Repeater>
 </ul>
  </div>
  
  <%--<div class="pagination"><div class="links"> <b>1</b>  <a href="#">&gt;|</a> </div><div class="results">Showing 1 to 12 of 14 (2 Pages)</div></div>--%>
  <script type="text/javascript"><!--
function display(view) {
	if (view == 'list') {
		$('.product-grid ').attr('class', 'product-list');
		
		$('.product-list ul li').each(function(index, element) {
			html  = '<div class="right">';
				html += '  <div class="price">' + $(element).find('.price').html() + '</div>';
			html += '  <div class="cart">' + $(element).find('.cart').html() + '</div>';
			html += '</div>';			
			
			html += '<div class="left">';
			
			var image = $(element).find('.image').html();
			
			if (image != null) { 
				html += '<div class="image">' + image + '</div>';
			}
			
	
					
			html += '  <div class="name">' + $(element).find('.name').html() + '</div>';
			html += '  <div class="description">' + $(element).find('.description').html() + '</div>';
			
			var rating = $(element).find('.rating').html();
			
			if (rating != null) {
				html += '<div class="rating">' + rating + '</div>';
			}
				
			html += '</div>';

						
			$(element).html(html);
		});		
		
		$('.display').html('<b>Display:</b> <div id="list_b"></div> <a id="grid_a" onclick="display(\'grid\');">Grid</a>');
		
		$.cookie('display', 'list'); 
	} else {
		$('.product-list').attr('class', 'product-grid');
		
		$('.product-grid ul li').each(function(index, element) {
			html = '';
					
			var image = $(element).find('.image').html();
			
			if (image != null) {
				html += '<div class="image">' + image + '</div>';
			}
			
		html += '<div class="name">' + $(element).find('.name').html() + '</div>';
			
			
			var price = $(element).find('.price').html();
			
			if (price != null) {
				html += '<div class="price">' + price  + '</div>';
			}
	
			html += '<div class="description">' + $(element).find('.description').html() + '</div>';
			
			var rating = $(element).find('.rating').html();
			
			if (rating != null) {
				html += '<div class="rating">' + rating + '</div>';
			}
						
			html += '<div class="cart">' + $(element).find('.cart').html() + '</div>';
			
			
			
			$(element).html(html);
		});	
					
		$('.display').html('<b>Display:</b> <a id="list_a" onclick="display(\'list\');">List</a>  <div id="grid_b"></div>');
		
		$.cookie('display', 'grid');
	}
}

view = $.cookie('display');

if (view) {
	display(view);
} else {
	display('list');
}
//--></script> 
<script type="text/javascript">
		(function($){$.fn.equalHeights=function(minHeight,maxHeight){tallest=(minHeight)?minHeight:0;this.each(function(){if($(this).height()>tallest){tallest=$(this).height()}});if((maxHeight)&&tallest>maxHeight)tallest=maxHeight;return this.each(function(){$(this).height(tallest)})}})(jQuery)
	$(window).load(function(){
		if($(".cat-height").length){
		$(".cat-height").equalHeights()}
	})
</script>
</asp:Content>

